<template>
	<view  class="coreshop-flex coreshop-flex-direction">
		<u-toast ref="uToast" /><u-no-network></u-no-network>
		<u-navbar title="计划详情" safeAreaInsetTop fixed placeholder>
		    <view class="coreshop-navbar-left-slot" slot="left">
		        <u-icon name="arrow-left" size="19" @click="goNavigateBack"></u-icon>
		        <u-line direction="column" :hairline="false" length="16" margin="0 8px"></u-line>
		        <u-icon name="home" size="22" @click="goHome"></u-icon>
		    </view>
		    <view slot="right">
		    </view>
		</u-navbar>
		
		<view>
			<view class="coreshop-flex coreshop-flex-direction-column card">
					<view class="coreshop-flex coreshop-flex-direction-row coreshop-justify-between">
						<view class="plan-title">
							{{planInfo.gzjh || '--'}}
						</view> 
						<u-tag :text="planInfo.planType || '--'" plain shape="circle"></u-tag>
					</view>
					<view class="coreshop-flex plan-auth u-flex">
						<view class="head-box">{{planInfo.addAccName[0]}}</view>
							{{planInfo.addAccName || '--'}}
						<text class="update-time">最新修改时间：{{$common.longDateFormate(planInfo.chgTime) || '--'}}</text>
					</view>
			</view>
			<view v-for="(item,index) in planItemList" :key="index" class="plan-list card" style="min-height: 215px;">
				<view v-if="editCur == index">
					<!-- <edit-plan-item
						:planType="planInfo.JHLX"
						:planItemData.sync="editItem" 
						:isEdit.sync="editCur" 
						@editSure="editSure" 
						:hideTextarea="showSelectCorrelation || showSelectClient || showCorrelation" 
						:showSelectCorrelation.sync="showSelectCorrelation" 
						:showSelectClient.sync="showSelectClient" >
					</edit-plan-item> -->
				</view>
				<view v-else> 
					<view class="coreshop-flex coreshop-justify-between planborder">
						<view class="coreshop-flex-sub coreshop-font-sm">
							计划时间：{{$common.longDateFormate(planInfo.Date)}}~{{$common.longDateFormate(planInfo.EndDate)}}
						</view>
						<u-icon name="edit-pen" color="#2A8FFC" @click="editYearItem(index)" v-if="planInfo.YWYID == userData.ID && isPublish && planInfo.JHLX == 4"></u-icon>
					</view>
					<u-line length="100%" margin="12rpx 0 0 0"></u-line>
				</view>
			</view>
			
			<view class="coreshop-flex coreshop-justify-center coreshop-align-center card" style="height: 90rpx;" @click="addItem" v-if="planInfo.YWYID == userData.ID && (!isFinish || !isPublish)">
				<view slot="body" class="coreshop-flex coreshop-justify-center add-btn">
					<u-icon name="plus" custom-prefix="custom-icon" color="#157EFB" :bold="true" size="15" :custom-style="{'margin-right':'14rpx'}"></u-icon>
					添加事项
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return { 
				planID:'',
				planAuth:'',//2为收到的计划，无分解计划  4为评阅计划
				planInfo:{},
				planItemList:[{}],
				typeList:[], 
				// 年计划修改
			    editCur:null,
			}
		},
		onLoad(e) {
			this.planID = e.id;
			this.planAuth = e.planAuth || '';
		},
		onShow() {
			this.typeList = this.$db.get('workPlanType');
			this.planInfo.gzjh='2024年第26周计划'
			this.planInfo.planType=this.typeList.find(item=>item.value == 2).label
			this.planInfo.addAccName='张三'
			this.planInfo.chgTime='2024-06-29 16:07'
			this.planInfo.Date='2024-06-24 00:00'
			this.planInfo.EndDate='2024-06-30 23:59'
		},
		methods:{
			editYearItem(idx){
				// this.editItem = this.planItemList[idx];
				// this.editCur = idx; 
			},
		}
	}
</script>
	

<style lang="scss" scoped>
	.plan-title{
		font-size: 28rpx;
		color: #333;
		margin-right: 10rpx;
	}
	.head-box{
		width: 41rpx;
		height: 41rpx;
		background-color: #2A8FFC;
		border-radius: 50%;
		font-size: 24rpx;
		color: #fff;
		text-align: center;
		line-height: 38rpx;
		margin-right: 9rpx;
	}
	.plan-auth{
		font-size: 26rpx;
		color: #333333;
		margin-top: 20rpx;
		.update-time{
			color: #A7AAB0;
			margin-left: 17rpx;
		}
	}
	.card{
		border: 1px solid #F7F7F7;background-color: #FFFFFF;border-radius:20rpx;height: 160rpx;margin: 20rpx;padding:20rpx;
	}
	.plan-list{
		border-top: 1px solid #eee;
	}
	.plan-item{
		padding: 0 20rpx 10rpx;
	} 
	.add-btn{
		font-size: 26rpx;
		color: #157EFB;
		text-align: center;
		line-height: 40rpx;
	}
</style>